<?xml version="1.0" encoding="UTF-8" ?>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://xmlns.jcp.org/jsf/html"
    xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
    xmlns:c="http://xmlns.jcp.org/jsp/jstl/core"
    xmlns:f="http://xmlns.jcp.org/jsf/core">
<h:head>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <ui:insert name="meta" />
    <link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.css" />
    <link rel="stylesheet" href="/content/style.css" type="text/css" />
    <script src="https://code.jquery.com/jquery-1.10.2.min.js" />
    <script src="https://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.js" />
    <script type="text/javascript" src="/content/script.js" />
    <c:if test="${empty sessionScope.TIMEZONE}">
    <script type="text/javascript">
    $(document).ready(function() {
    	var now = new Date();
        $.post("/UtilityServlet", {date: now.toString(), timezoneOffset: now.getTimezoneOffset()});
    });
    </script>
    </c:if>
    <c:if test="${empty sessionScope.LOCALE}">
    <meta name="google-translate-customization" content="543d0c486f58ca6-288b5be59cecf331-gb9f1e1f7585eb24c-15" />
    <script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit" />
    <script type="text/javascript">
    function googleTranslateElementInit() {
        new google.translate.TranslateElement({pageLanguage: 'en', layout: google.translate.TranslateElement.InlineLayout.SIMPLE}, 'google_translate_element');
    }
    </script>
    </c:if>
    <title>
        <ui:insert name="title">${msg['layout.title']}</ui:insert>
    </title>
</h:head>
<h:body>
    <ui:insert name="style" />
    <ui:insert name="script" />
    <ui:insert name="menu">
        <ui:include page="/WEB-INF/content/menu.xhtml" />
    </ui:insert>
    <header data-role="header" data-theme="b">
        <ui:insert name="left">
            <a href="#menu" data-icon="bars" data-iconpos="notext">${msg['layout.menu']}</a>
        </ui:insert>
        <h1>
            <ui:insert name="title">${msg['layout.title']}</ui:insert>
        </h1>
        <ui:insert name="right">
            <a href="/" data-icon="home" data-iconpos="notext">${msg['layout.home']}</a>
        </ui:insert>
    </header>
    <article data-role="content" style="overflow: auto;" data-theme="b">
        <ui:insert name="content" />
    </article>
    <footer style="text-align: center;" data-role="footer" data-theme="b">
        <p style="font-size: smaller; margin: 0em">
        <h:outputText value="${msg['layout.expires']}" />
        <h:outputText value="#{bean.sessionExpires}" styleClass="fromNow">
            <f:convertDateTime timeZone="${sessionScope.TIMEZONE}" pattern="EEE MMM dd yyyy HH:mm:ss 'GMT'Z (z)" />
        </h:outputText>
        <br />
        <h:outputText value="${msg['layout.copyright']}" />
        </p>
        <c:if test="${empty sessionScope.LOCALE}">
        <div id="google_translate_element" />
        </c:if>
    </footer>
</h:body>
</html>
